/*
 * @Author: chengsl
 * @Date: 2023-01-09 15:16:21
 * @LastEditors: chengsl
 * @LastEditTime: 2023-01-09 15:17:31
 * @Description: 条形图 widgetHorizontalBar
 */
export default {
  title: {
    text: '',
    show: false,
    left: 'center',
    textStyle: { color: '#fff', fontSize: 20, fontWeight: 'normal' },
    subtext: '',
    subtextStyle: { color: '#fff', fontWeight: 'normal', fontSize: 20 }
  },
  grid: { left: 30, right: 40, bottom: 30, top: 50, containLabel: true },
  tooltip: {
    trigger: 'axis',
    show: true,
    axisPointer: { type: 'shadow' },
    textStyle: { color: '', fontSize: 16, fontWeight: 'normal' }
  },
  xAxis: [
    {
      splitLine: { show: false, lineStyle: { color: '#fff' } },
      type: 'value',
      axisLine: { show: true, lineStyle: { color: '#fff' } },
      axisLabel: {
        show: true,
        interval: 0,
        rotate: 0,
        textStyle: { color: '#fff', fontSize: 14 }
      },
      show: false,
      name: '',
      nameTextStyle: { color: '#fff', fontSize: 14 },
      nameRotate: 0,
      inverse: false,
      data: [
        '预约挂号人次',
        '避孕手术预约',
        '孕前检查预约',
        '在线支付笔数',
        '成人疫苗预约',
        '两癌筛选预约',
        '社康挂号人次',
        '移动报告查询'
      ]
    }
  ],
  yAxis: [
    {
      splitLine: { show: false },
      type: 'category',
      position: 'left',
      inverse: true,
      splitArea: { show: false },
      axisLine: { show: false },
      axisTick: { show: false },
      axisLabel: {
        show: true,
        color: '#A9B2BC',
        textStyle: { color: '#A9B2BC', fontSize: 20 },
        formatter: {
          _custom: {
            type: 'function',
            display:
              '<span style="opacity:.5;">function</span> formatter(name)',
            tooltip:
              "<pre>function formatter(name) {\n            return name.length > 9 ? name.substr(0, 9) + '...' : name;\n          }</pre>",
            _reviveId: 0
          }
        }
      },
      show: true,
      name: '',
      nameLocation: 'end',
      nameTextStyle: { color: '#A9B2BC', fontSize: 20 },
      data: [
        '预约挂号人次',
        '避孕手术预约',
        '孕前检查预约',
        '在线支付笔数',
        '成人疫苗预约',
        '两癌筛选预约',
        '社康挂号人次',
        '移动报告查询'
      ]
    },
    {
      type: 'category',
      position: 'right',
      inverse: true,
      offset: 60,
      axisTick: 'none',
      axisLine: 'none',
      axisLabel: {
        align: 'right',
        fontSize: 20,
        fontWeight: 'bold',
        lineHeight: 16,
        color: '#fff',
        formatter: {
          _custom: {
            type: 'function',
            display:
              '<span style="opacity:.5;">function</span> formatter(value)',
            tooltip:
              '<pre>function formatter(value) {\n            return echarts__WEBPACK_IMPORTED_MODULE_7__["format"].addCommas(value) + \'\'; // TODO this.unit\n          }</pre>',
            _reviveId: 1
          }
        }
      },
      nameLocation: 'end',
      nameTextStyle: {
        color: '#fff',
        align: 'right',
        fontWeight: 'bold',
        fontSize: 20
      },
      show: true,
      name: '',
      data: [61407, 26529, 26415, 26358, 25178, 23992, 21835, 21524]
    }
  ],
  series: [
    {
      name: '',
      type: 'bar',
      zlevel: 1,
      data: [61407, 26529, 26415, 26358, 25178, 23992, 21835, 21524],
      label: { show: false },
      emphasis: { itemStyle: { opacity: 1 } },
      barWidth: 30,
      showBackground: true,
      backgroundStyle: { color: 'rgba(68, 107, 245, 0.1)' },
      itemStyle: {
        color: {
          colorStops: [
            { offset: 0, color: '#0060FF' },
            { offset: 1, color: '#0060FF' }
          ],
          x: 1,
          y: 0,
          x2: 0,
          y2: 0,
          type: 'linear',
          global: false
        },
        opacity: 0.9
      }
    }
  ],
  dataZoom: [
    { type: 'inside', yAxisIndex: [0], start: 0, end: 100 },
    { type: 'inside', yAxisIndex: [1], start: 0, end: 100 }
  ]
}
